﻿@{
    ViewData["Title"] = "物品管理";
}
<h1>物品管理列表</h1>

<link href="~/css/site.css" rel="stylesheet" />
<link href="~/layui/css/layui.css" rel="stylesheet" />

<div class="layui-form-item">
    <div class="layui-inline">
        <label class="layui-form-label">物品编号</label>
        <div class="layui-input-inline">
            <input type="text" id="goodsCode" class="layui-input" placeholder="请输入物品编号">
        </div>
    </div>
    <div class="layui-inline">
        <label class="layui-form-label">物品名称</label>
        <div class="layui-input-inline">
            <input type="text" id="goodsName" class="layui-input" placeholder="请输入物品名称">
        </div>
    </div>
    <div class="layui-inline">
        <button type="button" class="layui-btn" onclick="Getshow()">
            <i class="layui-icon layui-icon-search"></i> 查询
        </button>
        <button type="button" class="layui-btn layui-btn-normal" onclick="AddGoods()">
            <i class="layui-icon layui-icon-add-1"></i> 新增
        </button>
    </div>
</div>

<table class="layui-table" lay-size="sm">
    <thead>
        <tr>
            <th style="width:60px;">编号</th>
            <th style="width:120px;">物品编号</th>
            <th style="width:180px;">物品名称</th>
            <th style="width:120px;">规格型号</th>
            <th style="width:80px;">单位</th>
            <th style="width:120px;">类型</th>
            <th style="width:100px;">库存</th>
            <th style="width:100px;">单价</th>
            <th style="width:80px;">状态</th>
            <th style="width:200px;">备注</th>
            <th style="width:150px;">操作</th>
        </tr>
    </thead>
    <tbody id="body"></tbody>
</table>

<div id="demo-laypage-all"></div>

<script src="~/js/site.js"></script>
<script src="~/layui/layui.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>

<script>
    var pageindex = 1;
    var pagesize = 15;
    var total = 0;

    $(function(){
        Getshow();
    });

    function Getshow(){
        var goodsCode = $('#goodsCode').val() || '';
        var goodsName = $('#goodsName').val() || '';

        $('#body').html('<tr><td colspan="11" style="text-align:center;color:#999;">数据加载中...</td></tr>');

        $.ajax({
            url: 'http://localhost:5141/api/Goods/GetGoodsinfo',
            type: 'GET',
            data: {
                pageIndex: pageindex,
                pageSize: pagesize,
                goodsCode: goodsCode,
                goodsName: goodsName
            },
            success: function(res){
                if(res && res.pageData){
                    total = res.totalCount || 0;
                    var str = '';
                    if(res.pageData.length > 0){
                        $(res.pageData).each(function(){
                            var statusText = this.status ? '<span class="layui-badge layui-bg-green">启用</span>' : '<span class="layui-badge layui-bg-gray">禁用</span>';
                            var remark = this.remark || '';
                            str += `<tr>
                                        <td>${this.id}</td>
                                        <td>${this.goodsCode || ''}</td>
                                        <td>${this.goodsName || ''}</td>
                                        <td>${this.goodsModel || ''}</td>
                                        <td>${this.unit || ''}</td>
                                        <td>${this.goodsType || ''}</td>
                                        <td>${this.stock ?? ''}</td>
                                        <td>${this.price ?? ''}</td>
                                        <td>${statusText}</td>
                                        <td title="${remark}">${remark.length > 20 ? remark.substring(0,20)+'...' : remark}</td>
                                        <td>
                                            <button class="layui-btn layui-btn-xs" onclick="Detail(${this.id})"><i class="layui-icon layui-icon-edit"></i> 编辑</button>
                                            <button class="layui-btn layui-btn-xs layui-btn-danger" onclick="DelGoods(${this.id})"><i class="layui-icon layui-icon-delete"></i> 删除</button>
                                        </td>
                                    </tr>`;
                        });
                    }else{
                        str = '<tr><td colspan="11" style="text-align:center;color:#999;">暂无数据</td></tr>';
                    }
                    $('#body').html(str);
                    initPagination();
                }
            },
            error: function(){
                $('#body').html('<tr><td colspan="11" style="text-align:center;color:#f00;">数据加载失败，请重试</td></tr>');
                total = 0;
                initPagination();
            }
        });
    }

    function initPagination(){
        layui.use(['laypage'], function(){
            var laypage = layui.laypage;
            laypage.render({
                elem: 'demo-laypage-all',
                count: total,
                limit: pagesize,
                limits: [10,15,20,25,30,50],
                layout: ['count','prev','page','next','limit','refresh','skip'],
                jump: function(obj, first){
                    if(!first){
                        pageindex = obj.curr;
                        pagesize = obj.limit;
                        Getshow();
                    }
                }
            });
        });
    }

    function DelGoods(id){
        layui.use('layer', function(){
            var layer = layui.layer;
            layer.confirm('确认删除该物品吗？',{icon:3,title:'提示',btn:['确定','取消']}, function(index){
                var load = layer.load(1,{shade:[0.3,'#000']});
                $.ajax({
                    url: 'http://localhost:5141/api/Goods/DeleteGoodsinfo',
                    type: 'POST',
                    data: JSON.stringify({ id: id }),
                    contentType: 'application/json',
                    success: function(res){
                        layer.close(load);
                        if(res && (res.data > 0 || res > 0)){
                            layer.msg('删除成功',{icon:1,time:1500});
                            Getshow();
                        }else{
                            layer.msg('删除失败: ' + (res.message || '未知错误'),{icon:2});
                        }
                    },
                    error: function(){
                        layer.close(load);
                        layer.msg('请求失败',{icon:2});
                    }
                });
                layer.close(index);
            });
        });
    }

    function openInContainer(url, title){
        if(window.parent && window.parent.loadPage){
            window.parent.loadPage(url, title || document.title);
        }else{
            location.href = url;
        }
    }

    function Detail(id){
        localStorage['goodsId'] = id;
        openInContainer('/Bom/GoodsEdit', '编辑物品');
    }

    function AddGoods(){
        openInContainer('/Bom/GoodsAdds', '新增物品');
    }
</script>
